<template>
	<view class="page1">
		<view class="listPage">
			<view class="listBox" v-for="(item,index) in listData" :key="index">
				<view class="boxLeft">
					<view class="boxName">{{item.remark}}</view>
					<view class="boxTime">{{item.create_time}}</view>
				</view>
				<view class="boxRight">
					<view :class="item.user_money > 0 ? 'z boxName'  : 's boxName'">{{item.user_money > 0 ? '+' : ''}}{{item.user_money}}玉石</view>
					<!-- <view class="z boxName" v-if="item.status == 1">+{{item.money}}元</view> -->
					<!-- <view class="boxAf">剩余：0.45</view> -->
				</view>
			</view>
		</view>
		<u-loadmore :status="status" :load-text="loadText" @loadmore="initView" style="padding-top: 40rpx;" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				status: 'loadmore',
				loadText: {
					loadmore: '点击或上拉加载更多',
					loading: '正在加载...',
					nomore: '没有更多了'
				},
				listData: [],
				param: {
					page: 0,
					limit: 10,
					type: 0
				},
				xianshi: ''
			};
		},
		onReachBottom() {
			this.status = 'loading'
			this.initView()
		},
		onLoad(option) {
			this.param.type = option.type || 0
			this.initView()
		},
		methods: {
			initView() {
				this.param.page = this.param.page + 1
				this.$net.req('/Account/getLists',this.param).then(res=>{
					if(res.code == 200){
						if (res.data.length < 10) {
							this.status = 'nomore'
						} else {
							this.status = 'loadmore'
						}
						this.listData = this.listData.concat(res.data.list)
					}
				})
					// blanceDetail(this.param).then(res => {
					
					// 	if (res.data.length < 10) {
					// 		this.status = 'nomore'
					// 	} else {
					// 		this.status = 'loadmore'
					// 	}
					// 	this.listData = this.listData.concat(res.data)
					// })
			

			}
		}
	}
</script>

<style lang="scss" scoped>
	.page1 {
		min-height: 100vh;
		padding-bottom: 200rpx;
		background: #F8F6F6;
	}

	.listPage {
		margin: 20rpx;

		.listBox {
			background: #FFFFFF;
			height: 160rpx;
			padding: 32rpx;
			display: flex;
			flex-direction: row;
			// width: 646rpx;
			border-bottom: 2rpx solid rgba(0, 0, 0, 0.06);

			.z {
				color: #F8852A !important;
			}
			
			.s{
				color: #999999 !important;
			}

			.boxName {
				font-size: 32rpx;
				font-family: SourceHanSansCN-Medium, SourceHanSansCN;
				font-weight: 500;
				color: #333333;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			.boxLeft {
				width: 70%;

				.boxTime {
					margin-top: 22rpx;
					font-size: 24rpx;
					font-family: SourceHanSansCN-Regular, SourceHanSansCN;
					font-weight: 400;
					color: #999999;
				}
			}

			.boxRight {
				text-align: right;
				width: 30%;

				.boxAf {
					margin-top: 20rpx;
					font-size: 28rpx;
					font-family: SourceHanSansCN-Regular, SourceHanSansCN;
					font-weight: 400;
					color: #999999;
				}
			}
		}
	}
</style>
